<template>
	<view class="contents">
		<!-- 搜索框 -->
		<view class="search" style="height: 222upx;position: relative;top:0;padding: 0;">
			<view class="service-wrapper" style="padding: 8px 13px;">
				<view class="service-item" @click="hanldcarTypeArr(item,index)" v-if="index>0" v-for="(item,index) in carTTitleypeArr" :key="index" v-bind:class="[index==opheader?'sticStyle':'']">
					<image :src="item.logo"></image>
					<view class="service-text">{{item.name}}</view>
				</view>
			</view>
			<view style="height: 10px;width: 100%;background-color: #F5F5F5;"></view>
		</view>
		<view class="car-title">{{carText}}
			<text style="font-size: 12px;color: #999999;font-weight: normal;padding-left: 11px;">优质品牌 放心之选</text>
		</view>
		<!-- 条件筛选 -->
		<view class="sticky-box">
			<view style="position: relative;">
				<view class="stic-wrapper">
					<view class="stic-item" v-for="(item,index) in sticList" :key="index"  @click="hanldSticMask(index)" v-bind:class="[index==type_stic?'sticStyle':'']">
						{{item}}<image src="../../static/image/bottom-gray.png"></image>
					</view>
				</view>
				<view class="drop-wrapper" v-if="sticMask&&type_stic==0" >
					<view class="drop-item" v-for="(item,index) in brandArr" :key="index" v-bind:class="[index==opCard_stic1?'sticStyle':'']" @click="hanldopCard1(item,index)">{{item.name}}</view>
				</view>
				
				<view class="drop-wrapper" v-if="sticMask&&type_stic==1" >
					<view class="drop-item" v-for="(item,index) in carTypeArr" :key="index" v-bind:class="[index==opCard_stic2?'sticStyle':'']" @click="hanldopCard2(item,index)">{{item.name}}</view>
				</view>
				
				<view class="drop-wrapper" v-if="sticMask&&type_stic==2" >
					<view class="drop-item" v-for="(item,index) in yearsArr" :key="index" v-bind:class="[index==opCard_stic3?'sticStyle':'']" @click="hanldopCard3(item,index)">{{item.value}}</view>
				</view>
				
				<view class="drop-wrapper" v-if="sticMask&&type_stic==3">
					<view class="drop-item" v-for="(item,index) in priceArr" :key="index"  v-bind:class="[index==opCard_stic4?'sticStyle':'']"  @click="hanldopCard4(item,index)">{{item.value}}</view>
				</view>
				
				<view class="drop-item" style="position: absolute;padding: 0;display: none;"  :class="{ aastyle: aaActive }">
					<lb-picker ref="picker" v-model="address"
					  mode="multiSelector"
					  :list="listAreaData"
					  :level="2"
					   @change="handleChange"
						@confirm="handleConfirm"
					 @cancel="handleCancel"
					 >
					</lb-picker>
				</view>
			</view>
		</view>
			<!--背景-->
		<view class="stic-Mask"  @click="hanldMaskNo()"  v-if="sticMask"></view>
		<!-- 高级赛选 -->
		<lvv-popup position="top" ref="lvvpopref" style="background: none;">
			<view class="fliter-c">
				<scroll-view scroll-y="true" style="height: 100%;">
					<view class="fliter-item">
						<view class="cell-item right-img">
							<view class="cell-item-hd">
								<view class="cell-hd-title">价格区间</view>
							</view>
						</view>
						<view class="fliter-i-c">
							<view class="fic-item"><input class="fic-item-input" type="number" v-model="sPrice" /></view>
							<view class="fic-item-line"></view>
							<view class="fic-item"><input class="fic-item-input" type="number" v-model="ePrice" /></view>
						</view>
					</view>
					<view class="fliter-item" v-if="cat_list.length > 0">
						<view class="cell-item right-img">
							<view class="cell-item-hd">
								<view class="cell-hd-title">分类</view>
							</view>
						</view>
						<view class="fliter-i-c">
							<view v-for="item in cat_list" :key="item.goods_cat_id" v-if="item.goods_cat_id && item.name" @click="selectKey('cat_list', item.goods_cat_id)">
								<view class="fic-item" v-if="!item.isSelect">
									<view class="fic-item-text two-line">{{ item.name }}</view>
								</view>
								<view class="fic-item fic-item-active" v-else-if="item.isSelect">
									<view class="fic-item-text two-line">{{ item.name }}</view>
								</view>
							</view>
						</view>
					</view>
					<view class="fliter-item" v-if="brand_list.length > 0">
						<view class="cell-item right-img">
							<view class="cell-item-hd">
								<view class="cell-hd-title">品牌</view>
							</view>
						</view>
						<view class="fliter-i-c">
							<view v-for="item in brand_list" :key="item.brand_id" v-if="item.brand_id && item.name" @click="selectKey('brand_list', item.brand_id)">
								<view class="fic-item" v-if="!item.isSelect">
									<view class="fic-item-text two-line">{{ item.name }}</view>
								</view>
								<view class="fic-item fic-item-active" v-else-if="item.isSelect">
									<view class="fic-item-text two-line">{{ item.name }}</view>
								</view>
							</view>
						</view>
					</view>
					<view class="fliter-item" v-if="label_list.length > 0">
						<view class="cell-item right-img">
							<view class="cell-item-hd">
								<view class="cell-hd-title">标签</view>
							</view>
						</view>
						<view class="fliter-i-c">
							<view v-for="item in label_list" :key="item.id" v-if="item.id && item.name" @click="selectKey('label_list', item.id)">
								<view class="fic-item" v-if="!item.isSelect">
									<view class="fic-item-text two-line">{{ item.name }}</view>
								</view>
								<view class="fic-item fic-item-active" v-else-if="item.isSelect">
									<view class="fic-item-text two-line">{{ item.name }}</view>
								</view>
							</view>
						</view>
					</view>
				</scroll-view>
				<view class="button-bottom">
					<button class="btn btn-square" @click="toclose()">关闭</button>
					<button class="btn btn-b btn-square" @click="filterOk()">确定</button>
				</view>
			</view>
		</lvv-popup>

		<!-- 商品列表 -->
		<scroll-view  class="scroll-Y weixinscy" @scrolltolower="lower" enable-back-to-top="true"
		 lower-threshold="45" style=" margin-bottom: 140upx;">
			<!-- 表格图片 -->
			<view class="img-grids" v-show="current === 0">
				<view v-if="goodsList.length > 0">
					<view class="img-grids-item" v-for="(item, index) in goodsList" :key="index" @click="goodsDetail(item.id)">
						<image class="img-grids-item-t have-none" :src="item.image_url" mode="aspectFill"></image>
						<view class="img-grids-item-b">
							<view class="goods-name grids-goods-name">{{ item.name }}</view>
							<view class="goods-item-c">
								<view class="goods-price red-price">{{ item.price }}万</view>
								<image class="goods-cart" src="/static/image/ic-car.png"></image>
							</view>
						</view>
					</view>
				</view>
				<!-- 无数据时默认显示 -->
				<view class="order-none" v-else>
					<image class="order-none-img" src="/static/image/order.png" mode=""></image>
				</view>
			</view>

			<!-- 列表图片 -->
			<view class="img-list" v-show="current === 1">
				<view v-if="goodsList.length > 0">
					<view class="img-list-item" v-for="(item, index) in goodsList" :key="index" @click="goodsDetail(item.id)" style="margin-bottom: 0;    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: end;">
						<image class="img-list-item-l" :src="item.image_url" mode="aspectFill" style="width: 190upx;height: 150upx;    border-radius: 3px;border: none;"></image>
						<view class="img-list-item-r" style="min-height: auto;padding: 0; width: 496upx;">
							<view class="list-goods-name" style="font-weight: bold; text-overflow: inherit;  overflow: inherit;    color: #1E1F20;
    width: 100%;font-size: 15px;">{{ item.name }}</view>
						<view style="display: flex;flex-direction: row;    align-items: end;">
							
							<view class="goods-item-c">
								<!-- <view style="color: #666666;font-size: 10px;padding-bottom: 6px;">{{item.factory_date}}年出厂<text style="color: #CCCCCC;padding: 0 5px;">|</text>广州</view> -->
								<view style="color: #666666;font-size: 10px;padding-bottom: 6px;">{{item.factory_date}} ｜ {{item.hours}}小时 | {{item.address}}</view>
								<view class="list-detail">
									<text style="width:29px;height:15px;background:rgba(233,146,62,0.1);border-radius:1px;color: #E9923E;font-size: 9px;padding: 3px 5px;margin-right: 5px;">{{item.trade_type}}</text>
									<text style="width:29px;height:15px;background:rgba(6,139,248,0.1);border-radius:1px;color: #068BF8;font-size: 9px;padding: 3px 5px;">{{item.transfer_type}}</text>
								</view>
								<view class="goods-price red-price">{{ item.price }}万</view>
							</view>
							<view class="list-right-1" style="width: 124upx;text-align: right;">
							<view v-if="item.type==2">
								<image src="/static/images/kong.png" style="width: 50px;height: 50px;"></image>
							</view>
							<view style="width:54px;height:25px;border-radius:3px;border:1px solid rgba(6,139,248,1);text-align: center;line-height: 25px;font-size: 14px;color: #068BF8;margin: 0 0 0 auto;"  @click.stop="hanldPhone(item.id)"  v-if="item.type==1">询价</view>
<!-- 							<text style="color: #999999;font-size: 10px;text-align: right;margin-top: 30upx;display: block;">{{item.ctime.substring(5,10)}}发布</text>
 -->						</view>
							</view>
						</view>
						
					</view>
					<uni-load-more
					:status="loadStatus"
					></uni-load-more>
				</view>
				<view class="order-none" v-else>
					<image class="order-none-img" src="/static/image/order.png" mode=""></image>
				</view>
			</view>
		</scroll-view>
	
		<view class="car-buttom">
			<view class="re-buttom">
				<view class="re-left" @click="hanldsellCar()">
					<image src="../../static/images/msiche.png"></image><text style="margin-left: 5px;">我要卖车</text>
				</view>
				<view class="re-right" @click="hanldbuyCar()">
					<image src="../../static/images/maiche.png"></image><text style="margin-left: 5px;">我要买车</text>
				</view>
			</view>
		</view>
		
		<!--咨询-->
		<uni-popup ref="popup_mask" type="center" :maskClick="maskClick" >
			<view class="father-wrapper">
					<view id="son">
						<view style="margin-top: 18px;font-size: 17px;color: #333;font-weight: bold;">免费通话</view>
						<image src="/static/images/baotuiyuan.png" style="width: 24px;height: 24px;float: right; margin-top: -24px;
			margin-right: 16px;"></image>
						<view style="font-weight: normal;font-size: 12px;color: #666666;padding: 21px 16px 15px 16px">对设备感兴趣？你的所有问题一通电话全解决！</view>
						<view class="fee-input" style="font-size: 17px;color: #333;font-weight: bold;">{{shop_mobile}}</view>
						<view class="fee-but"  @click="hanldCall()">确定</view>
					</view>
				</view>
		</uni-popup>
	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	import uniPopupMessage from '@/components/uni-popup/uni-popup-message.vue'
	import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue'
	//
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue'
	
	import lvvPopup from '@/components/lvv-popup/lvv-popup.vue';

	//下拉框
	import slFilter from '@/components/sl-filter/sl-filter.vue';
	import areaData from '../service/area-data-min2';
	import areaPicker from "@/components/area-picker/areaPicker.vue";
	import LbPicker from '@/components/lb-picker';
	export default {
		data() {
			return {
				sticList:['品牌','泵车','年限','价格','地区'],
				carText:'精选泵车',
				sticMask:false,
				type_stic:1,
				//
				current: 1,
				id: '',
				showView: false,
				minPrice: '',
				maxPrice: '',
				ajaxStatus: false,
				loading: true,
				loadingComplete: false,
				
			
				sPrice: '',
				ePrice: '',
				brand_list: [],
				cat_list: [],
				label_list: [],
				pos: 0,
				isActive: false,
				topFixed: false,
				brandArr:[],//品牌
				carTypeArr:[],
				carHeader_stic:1,//头部车辆分类
				carTTitleypeArr:[],
				yearsArr:[],//年限
				priceArr:[],//价格
				opheader:1,
				opCard_stic1:0,//选项卡下切换--品牌
				opCard_stic2:1,//选项卡下切换--泵车
				opCard_stic3:0,//选项卡下切换--年限
				opCard_stic4:0,//选项卡下切换--价格
				opCard_stic5:0,//选项卡下切换-地区
				list:{},
				loadStatus: 'more',
				page: 1,
				limit: 10,//每页显示几条
				goodsList:[],
				refresh:false,
				maskClick:true,
				shop_mobile:"",
				areaAddress:"",
				listAreaData: areaData,
				area_id:'',//市id
				value11:'',
				address:[],
				aaActive:false
			}
		},
		computed: {
			computedClassStr() {
				return this.isActive ? 'activeCar' : ''
			}
		},
		onShareAppMessage: function () {
		 
		 },
		onShow() {
		        //拿到showPoster缓存
		    let carIndex_type = this.$getStorage("carIndex_type");
			if(carIndex_type){
				this.list['car_type'] = carIndex_type.id;
				this.opheader = carIndex_type.id;
				this.opCard_stic2 = carIndex_type.id;
				this.sticList[1] = carIndex_type.name;
				this.carText = carIndex_type.name;
				this.getGoods();
			}
			// console.log(carIndex_type)
			this.initData();
			this.getCargetarea();
		},
		onHide(){
			  uni.removeStorage({
			        key: 'carIndex_type',
			    });
		},
		//加载执行
		onLoad: function(options) {
			this.list['car_type'] = 1;
			this.getGoods();
			this.getcarGettype()//获取类型
		},

		components: {
			lvvPopup,
			slFilter,
			uniLoadMore,
			uniPopup,
		   uniPopupMessage,
		   uniPopupDialog,
		   areaPicker,
		   LbPicker
		},

		onReachBottom () {
				if (this.loadStatus === 'more') {
					this.getGoods(true)
				}
			},
		methods: {
			
			//地点
			handleChange(item) {
				console.log('change::', item);
				
			},
			handleConfirm(item) {			
				console.log('confirm::', item);
				// this.area_id = item.item[1].value//地图id
				this.area_id = item.value[1]//地图id
				this.list['address'] = this.area_id;
				this.getGoods()
				this.sticMask = false;
				this.aaActive = false;
			},
			handleCancel(item) {
				console.log('cancel::', item);
				console.log('取消');
				this.sticMask = false;
				this.aaActive = false
			},
			getCargetarea() {
				let data = {
					
				}
				// 获取用户信息
				var _this = this
				//判断是开启分销还是原始推广
				this.$api.cargetarea(data,res => {
					this.areaAddress = res.data;
					this.areaAddress.unshift({name:'全部'})
					console.log(this.areaAddress)
				})
				},
			initData() {
				// 获取用户信息
				var _this = this
				//判断是开启分销还是原始推广
				this.$api.shopConfig(res => {
					this.config = res;
					this.shop_mobile = this.config.shop_mobile;
					console.log(this.shop_mobile+'show_mm')
					
				})
				},
			//问底价
			hanldPhone(id){
				// uni.navigateTo({
				// 	url:'freeCall'
				// })

				  this.$refs.popup_mask.open();
				  console.log(id+'iddd')
				let data = {
					car_id:id
				}
				this.$api.carinquiry(data, res => {
					if (res.status == true) {
						console.log('询价了')
					}
			})
			},
			//打电话
			hanldCall() {
				let that = this;
				that.$refs.popup_mask.close()
				console.log(typeof that.shop_mobile)
				  wx.makePhoneCall({
					phoneNumber: that.shop_mobile+''
				  });
			},
			hanldcarTypeArr(item,e){
				// this.carHeader_stic = e+1;
				// this.list['car_type'] = e+1;
				// this.getGoods();
				console.log(item,e)
				this.opheader = e;
				this.list['car_type'] = e;
				this.sticList[1] = item.name;
				this.carText = item.name;
				this.opCard_stic2 = e
				this.getGoods()
			},
			//品牌
			hanldopCard1(item,index){
				this.opCard_stic1 = index;
				this.list['brand_id'] = item.id;
				// if(this.opCard_stic1==1){
				// 	this.list={};
				// }
				this.getGoods()
				// console.log(this.list)
				this.sticMask = false;
			},
			
			//泵车
			hanldopCard2(item,index){
				console.log(index)
				this.opCard_stic2 = index;
				this.list['car_type'] = index;
				console.log(index+'index')
				if(index==0){
					this.carText = '车型';
					this.sticList[1] ='车型';
				}else{
					this.carText = item.name;
					this.sticList[1] = item.name;
				}
				this.opheader = index;
				console.log(this.sticList)
				// if(this.opCard_stic2==1){
				// 	this.list={};
				// }
				this.getGoods();
				// console.log(this.list);
				this.sticMask = false;
			},
			
			//年限
			hanldopCard3(item,index){
				this.opCard_stic3 = index;
				this.list['year_f'] = item.year_f;
				this.list['year_t'] = item.year_t;
				// if(this.opCard_stic3==1){
				// 	this.list={};
				// }
				this.getGoods();
				// console.log(this.list);
				this.sticMask = false;
			},
			//价格
			hanldopCard4(item,index){
				this.opCard_stic4 = index;
				this.list['price_f'] = item.price_f;
				this.list['price_t'] = item.price_t;
				// if(this.opCard_stic4==1){
				// 	this.list={};
				// }
				this.getGoods();
				// console.log(this.list);
				this.sticMask = false;
			},
			//地区
			hanldopCard5(item,index){
					this.opCard_stic5 = index;
					this.list['address'] = item.id;
					this.getGoods()
					this.sticMask = false;
			},
			
			
			//展开菜单
			hanldSticMask(index){
				
				console.log('picker',index)
				console.log(this.$refs)
						
				if(index == 4){
					this.$refs.picker.show() // 显示
					this.aaActive = true
				}else{
					this.$refs.picker.hide() // 显示
					this.aaActive = false
				}
				
				this.type_stic = index;
				this.sticMask = true;
				
			},
			//关闭菜单
			hanldMaskNo(){
				console.log('啊啊啊')
				this.sticMask = false;
				this.aaActive = false;
				this.$refs.picker.hide() // 显示
				
			},
			//我要买车
			hanldbuyCar() {
				this.$common.navigateTo("buyCar")
			},
			//我要卖车
			hanldsellCar() {
				this.$common.navigateTo("sellCar")
			},

		
			
			//取得商品数据
			getGoods(type) {
				if(!type){
					this.page = 1;
				}
				let that = this;
				let arr = that.list;
				let listsrr = JSON.stringify(arr)
				let data = {
					page: that.page,
					limit: that.limit,
					order:'sort asc',
					where:listsrr
				}
				that.loadStatus = 'loading'
				that.$api.cargetlist(data, function(res) {
					if (res.status) {
						if (that.page >= res.data.total_page) {
							// 没有数据了
							that.loadStatus = 'noMore'
						} else {
							// 未加载完毕
							that.loadStatus = 'more'
							that.page ++
						}
						if(type){
								that.goodsList = [...that.goodsList, ...res.data.list];
						}else{
							that.goodsList = res.data.list;
						}
					} else {
						that.$common.errorToShow(res.msg)
					}
				});
			},
			
		
			// 获取类型
			getcarGettype() {
				this.$api.carGettype({}, res => {
					let item = res.data;
					if (res.status) {
						this.carTTitleypeArr = item.car_type;//头部上
						console.log(this.carTTitleypeArr)
						
						this.carTypeArr = item.car_type;//下拉
						this.carTypeArr.unshift({name:'全部'}); //属性
						this.brandArr = item.brand; //设备品牌
						this.brandArr.unshift({name:'全部'})
						this.yearsArr = item.years; //年限
						this.yearsArr.unshift({value:'全部'})
						this.priceArr = item.price;//价格
						this.priceArr.unshift({value:'全部'})
						
						console.log(this.carTTitleypeArr)
					} else {
						this.$common.errorToShow(res.msg)
					}
				})
			},
				
			goodsDetail(id){
						let url = '/pages/goods/index/carInfo?id=' + id;
						this.$common.navigateTo(url);
				}
	
		},
		// #ifdef MP-ALIPAY
		onChangeShowState_show: function() {
			var that = this;
			that.setData({
				showView: (that.showView = true)
			});
		},
		onChangeShowState_hid: function() {
			var that = this;
			that.setData({
				showView: (that.showView = false)
			});
		}
		// #endif
	};
</script>

<style scoped>
	.contents {
		background-color: #f5f5f5;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 100%;
	}
	.contents>>>.uni-popup{
		z-index: 99999;
	}

	.service-wrapper {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		text-align: center;
		color: #666666;
		font-size: 11px;
		height: 100px;
		background-color: #fff;
		align-items: center;
	}

	.service-item image {
		width: 72px;
		height: 50px;
	}

	page {
		background-color: #fff;
	}

	.search {
		position: fixed;
		height: 104upx;
		/*  #ifndef MP-WEIXIN */
		top: 44px;
		/*  #endif  */
	}

	.screen {
		width: 100%;
		padding: 10upx 26upx 20upx;
		margin-bottom: 2upx;
		background-color: #fff;
		position: fixed;
		top: calc(44px + 222upx);
		display: flex;
	}

	.screen-item {
		width: 20%;
		height: 50upx;
		display: flex;
		position: relative;
		align-items: center;
		justify-content: space-around;
	}

	.screents {
		border-left: 2upx solid #eee;
	}

	.screen-item-text {
		font-size: 24upx;
		color: #333;
		margin-right: 8upx;
	}

	.screen-item-icon {
		display: inline-block;
	}

	.screen-item-icon-img {
		width: 16upx;
		height: 8upx;
		display: block;
	}

	.screen-item-icon .screen-item-icon-img:first-child {
		margin-bottom: 4upx;
	}

	.list-grid {
		width: 44upx;
		height: 44upx;
		float: left;
	}

	.filter-img {
		width: 18upx;
		height: 8upx;
	}

	.img-grids {
		padding-bottom: 26upx;
	}

	.img-grids-item {
		margin-bottom: 0;
	}

	.img-grids>view,
	.img-list>view {
		overflow: hidden;
	}

	.scroll-Y {}

	.search-input-p {
		color: #888;
	}

	.order-none {
		text-align: center;
		padding: 200upx 0;
	}

	.order-none-img {
		width: 274upx;
		height: 274upx;
	}

	.fliter-c {
		width: 100%;
		/*  #ifdef  H5  */
		height: calc(100% - 44px - 184upx);
		top: calc(44px + 182upx);
		/*  #endif  */
		/*  #ifndef H5 */
		height: calc(100% - 184upx);
		top: 182upx;
		/*  #endif  */
		background: #ffffff;
		position: absolute;
		left: 0;

		padding-bottom: 90upx;
	}

	.fliter-item {}

	.fliter-item .cell-item {
		border-bottom: none;
	}

	.fliter-i-c {
		padding: 0 26upx;
		overflow: hidden;
	}

	.fic-item {
		display: inline-block;
		float: left;
		width: 160upx;
		margin-right: 14upx;
		height: 70upx;
		background-color: #f1f1f1;
		text-align: center;
		font-size: 24upx;
		margin-bottom: 14upx;
		color: #333;
		padding: 0 10upx;
	}

	.fic-item-active {
		background-color: #D62222;
		color: #fff;
	}

	.fic-item-text {
		position: relative;
		top: 50%;
		transform: translateY(-50%);
	}

	.fic-item:nth-child(4n) {
		margin-right: 0;
	}

	.fic-item-line {
		float: left;
		margin: 34upx 18upx 0 0;
		width: 50upx;
		height: 2upx;
		border-bottom: 2upx solid #ccc;
	}

	.fic-item-input {
		position: relative;
		top: 50%;
		transform: translateY(-50%);
	}

	/* #ifdef MP-ALIPAY */
	.hide {
		display: none;
	}

	.show {
		display: block;
	}

	/* #endif */
	.square {
		border-radius: 0;
	}

	.radius {
		border-radius: 12upx;
	}

	.car-title {
		z-index: 99;
		font-size: 18px;
		color: rgb(51, 51, 51);
		font-weight: bold;
		position: relative;
		height: 59px;
		background-color: #fff;
		width: 100%;
		line-height: 59px;
		padding-left: 13px;
	}

	.re-buttom {
		overflow: hidden;
		height: 48px;
		display: flex;
		flex-direction: row;
		text-align: center;
		line-height: 48px;
		font-size: 14px;
		position: fixed;
		/*#ifdef MP-WEIXIN*/
		bottom: 20px !important;
		/* #endif */
		bottom: 70px;
		right: 0;
		margin: 0 14px;
		left: 0;
		background-color: #D62222;
		border-radius: 5px;
	}

	.weixinscy {
		
	}

	.re-add {
		overflow: hidden;
		padding: 10px;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.re-right {
		flex: 1;
		color: #FFBB7A;
	}

	.re-right image {
		width: 28px;
		height: 28px;
		vertical-align: middle;
	}

	.re-left {
		flex: 1;
		border-right: 0.5px solid #C61A1A;
		color: #FFFFFF;
	}

	.re-left image {
		width: 28px;
		height: 28px;
		vertical-align: middle;
	}

	.car-buttom {}

	.content>>>.dropdown-item__selected .selected__name {
		font-size: 14px;
	}

	.content>>>.dropdown-item__content .list__option {
		font-size: 15px;
	}

	.sticky-box {
		/* #ifndef APP-PLUS-NVUE */
		position: -webkit-sticky;
		/* #endif */
		position: sticky;
		top: var(--window-top);
		z-index: 9999;
		flex-direction: row;
		margin: 0px;
		color: #333333;

	}

	.active {
		font-size: 46px;
	}

	.boxActive {
		position: fixed;
		top: 43px;
		/*#ifdef  MP-WEIXIN*/
		top: 0px !important;
		/* #endif */
		z-index: 9999999;
		width: 100%
	}

	.activeCar {
		display: none;
	}


	.noActiveCar {
		display: block;
	}

	.contents .filter-content-list-item-active {
		color: #D1372C !important;
	}

	.contents .filter-content-list-item-default {
		color: #333333 !important;
	}

.stic-wrapper{
	display: flex;
	flex-direction: row;
	background-color:#FFFFFF;
	justify-content: space-between;
	font-size: 14px;
	height: 40px;
	    align-items: center;
		padding: 0 16px;
}
.stic-item image{
	width: 10px;
	height: 6px;
	    vertical-align: middle;
	    margin-left: 5px;
}
	
.stic-Mask{
	background:rgba(0,0,0,0.6);
	width: 100%;
	height: 100%;
	position: fixed;
	top:0;
	z-index:9;
}
	
.drop-wrapper{
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    flex-direction: column;
    background-color: #FFFFFF;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    text-align: center;
    font-size: 15px;
    height: 280px;
    overflow-x: auto;
    align-items: center;
    justify-content: end;
}
.drop-item{
	padding: 13px 0;
	width: 100%;
}
.sticStyle{
	color: #D62222;
}
/*咨询*/
	#father {
	    display: -webkit-box;
	    display: -webkit-flex;
	    display: flex;
	    -webkit-box-pack: center;
	    -webkit-justify-content: center;
	    justify-content: center;
	    -webkit-box-align: center;
	    -webkit-align-items: center;
	    align-items: center;
	    background: rgba(0, 0, 0, 0.6);
	    height: 100vh;
	    font-size: 17px;
	    font-weight: bold;
	    position: fixed;
	    z-index: 9999;
	    top: 0;
	    left: 0;
	    right: 0;
	}
	
	#son {
		width: 270px;
		height: 236px;
		background: rgba(235, 235, 235, 1);
		border-radius: 10px;
		text-align: center;
		position: relative;
	}
	
	.fee-input {
		width: 238px;
		height: 38px;
		background: rgba(255, 255, 255, 1);
		border-radius: 6px;
		line-height: 38px;
		text-align: left;
		padding-left: 17px;
		margin: 0 16px;
	}
	
	.fee-but {
		width: 87px;
		height: 38px;
		background: rgba(214, 34, 34, 1);
		border-radius: 6px;
		text-align: center;
		line-height: 38px;
		color: #FFFFFF;
		margin: 23px auto;
	}
	.father-wrapper{
		    display: flex;
		    align-items: center;
		    justify-content: center;
	}
		
	.contents>>>.lb-picker .lb-picker-mask{
		display: none !important;
	}
		
	.contents>>>.lb-picker .lb-picker-container{
		position: relative !important;
	}
		
	.contents>>>.lb-picker .lb-picker-container .lb-picker-header .lb-picker-action{
		font-size: 14px !important;
	}
	.contents>>>.picker-item .lb-picker-column{
		font-size: 15px !important;
	}
	.aastyle{
		display: block !important;
	}
	
</style>
